import React, { Component } from 'react'
import huBei from './../images/hubei.png'
import bot from './../images/bot.gif'
import styles from './Footer.module.scss';
import api from './../serve/api'
import { withRouter } from 'react-router-dom'
import AppIcon from '../images/app.png'
import iOSIcon from '../images/ios.png'


class Footer extends Component {
 
  constructor(props) {
    super(props)
    this.state = {
      total: '',
      tabs: [{
        name: '关于我们'
      }, {
        name: '加入联盟'
      }, {
        name: '法律顾问'
      }, {
        name: '广告服务'
      }, {
        name: '网站声明'
      }, {
        name: '联系我们'
      }],
    }
  }

  componentDidMount() {
    this.getSystemInfo()
  }

  async getSystemInfo() {
    const { code, result } = await api.fetchSystemInfo()
    if (code !== '000000') {
      return
    }
    this.setState({
      total: result.total_times
    })

  }

  onInfo(index) {
    this.props.history.push(`/mainPage/zhikuAbout?type=${index}`)
  }

  render() {
    const { tabs } = this.state
    return (
      <div className={styles.footer}>
        <div className={styles.left}>
          <img src={bot} alt="" />
          <div>
            <span className={styles.cn}>湖北智库</span>
            <span className={styles.en}>HUBEIZHIKU</span>
          </div>
        </div>
        <div className={styles.center}>
          <ul>
            {tabs.map((title, index) => {
              return (
                <li key={index} onClick={() => this.onInfo(index)}>{title.name}</li>
              )
            })}
          </ul>
          <span className={styles.info}>鄂ICP备13008287号-3 ©2017 湖北省社会科学院 All Rights Reserved</span>
          <span className={styles.address}>地址：中国湖北武汉东湖路165号 湖北智库网（站）电话：027-86792500</span>
          <div className={styles.total_watch}>浏览量: {this.state.total}</div>
        </div>
        <div style={{ display: 'flex' }}>
          <div className={styles.right}>
            <img src={AppIcon} alt="AppIcon" />
            <span>智库安卓APP</span>
          </div>
          <div className={styles.right}>
            <img src={iOSIcon} alt="iOSIcon" />
            <span>智库iOSAPP</span>
          </div>
        </div>
      </div>
    )
  }
}
export default withRouter(Footer)